<template>
  <div style="width: 500px">
    <el-carousel height="150px" trigger="click">
      <el-carousel-item>
        <img src="b1.jpg" style="width: 100%;height: 100%">
      </el-carousel-item>
      <el-carousel-item>
        <img src="b2.jpg" style="width: 100%;height: 100%">
      </el-carousel-item>
      <el-carousel-item>
        <img src="b3.jpg" style="width: 100%;height: 100%">
      </el-carousel-item>
    </el-carousel>
  </div>
  <h3>卡片式</h3>
  <div style="width: 500px">
    <el-carousel height="150px" trigger="click" type="card">
      <el-carousel-item>
        <img src="b1.jpg" style="width: 100%;height: 100%">
      </el-carousel-item>
      <el-carousel-item>
        <img src="b2.jpg" style="width: 100%;height: 100%">
      </el-carousel-item>
      <el-carousel-item>
        <img src="b3.jpg" style="width: 100%;height: 100%">
      </el-carousel-item>
    </el-carousel>
  </div>
  <h3>垂直轮播图</h3>
  <div style="width: 500px">
    <el-carousel height="350px" trigger="click" direction="vertical" type="card">
      <el-carousel-item>
        <img src="b1.jpg" style="width: 100%;height: 100%">
      </el-carousel-item>
      <el-carousel-item>
        <img src="b2.jpg" style="width: 100%;height: 100%">
      </el-carousel-item>
      <el-carousel-item>
        <img src="b3.jpg" style="width: 100%;height: 100%">
      </el-carousel-item>
    </el-carousel>
  </div>
</template>

<script>
export default {
  name: "WView"
}
</script>

<style scoped>

</style>